<template>
    <view class="content">
        <up-sticky bgColor="#fff">
            <up-tabs :list="list" @click="click" lineColor="#F6D56C" :activeStyle="{
            color: '#F6D56C',
            fontWeight: 'bold',
            transform: 'scale(1.05)'
        }" itemStyle="padding-left: 15px; padding-right: 15px; height: 44px;width:100%"></up-tabs>
        </up-sticky>
        <view class="main-wrap">
            <view class="main-wrap-info" v-if="fetchData">
                <up-form>
                    <up-form-item label="头像" :labelWidth="100">
                        <template #right>
                            <image
                                :src="fetchData.avatar"
                                mode="scaleToFill"
                                style="width: 100rpx;height: 100rpx;border-radius: 50%;border: 1px solid #f2f2f2;"
                            />
                        </template>
                    </up-form-item>
                    <up-form-item label="昵称" :labelWidth="100">
                        <template #right>
                            {{ fetchData.nickName }}
                        </template>
                    </up-form-item>
                    <up-form-item label="性别" :labelWidth="100">
                        <template #right>
                            {{ fetchData.sex==1?'男':'女' }}
                        </template>
                    </up-form-item>
                    <up-form-item label="电话" :labelWidth="100">
                        <template #right>
                            {{ fetchData.phone }}
                        </template>
                    </up-form-item>
                    <up-form-item label="工作类型" :labelWidth="100">
                        <template #right>
                            {{ fetchData.workType==1?'全职':'兼职' }}
                        </template>
                    </up-form-item>
                    <up-form-item label="职位" :labelWidth="100">
                        <template #right>
                            {{ fetchData.positionItemName }}
                        </template>
                    </up-form-item>
                    <up-form-item label="所在地区" :labelWidth="100">
                        <template #right>
                            {{ fetchData.proName+fetchData.cityName+fetchData.regionName }}
                        </template>
                    </up-form-item>
                    <up-form-item label="参加工作时间" :labelWidth="100">
                        <template #right>
                            {{ fetchData.workDate }}
                        </template>
                    </up-form-item>
                    <up-form-item label="可接受月薪" :labelWidth="100">
                        <template #right>
                            {{ fetchData.monthlyPay }}
                        </template>
                    </up-form-item>
                    <up-form-item label="可接受日薪" :labelWidth="100">
                        <template #right>
                            {{ fetchData.dailyPay }}
                        </template>
                    </up-form-item>
                    <up-form-item label="可工作时间" :labelWidth="100">
                        <template #right>
                            {{ fetchData.wayType==1?'工作日':'周末' }}
                        </template>
                    </up-form-item>
                    <up-form-item label="个人简介" :labelWidth="100">
                        <up-textarea disabled v-model="fetchData.content" placeholder="个人简介"></up-textarea>
                    </up-form-item>
                </up-form>
            </view>
            <view class="main-wrap-info" style="margin-top: 32rpx" v-if="fetchData">
                <form-card v-for="(item,index) in fetchData.blurbSee" :item="item" :key="index"></form-card>
            </view>
            <view class="main-wrap-info" style="margin-top: 32rpx;display: flex;" v-if="fetchData">
                <view class="u-page__tag-item" v-for="(item,index) in fetchData.blurbSkill" :key="index">
                    <up-tag  :text="item.label" plain type="warning"></up-tag>
                </view>
            </view>
        </view>
        <view class="fixed-action-wrap" v-if="!fetchData">
            <view class="fixed-action-wrap-button" @click="toPage('/pages/mine/resume-detail')">简历认证</view>
        </view>
    </view>
</template>
<script setup>
import { ref, reactive, getCurrentInstance, onMounted } from 'vue';

const { proxy } = getCurrentInstance()
// 创建响应式数据  
const list = reactive([
    { name: '我的简历', id: 1 },
    { name: '简历草稿箱', id: 0 }
]);
const fetchData = ref([])
// 定义方法  
function click(item) {
    console.log('item', item);
    getList(item.id)
}

function toPage(url) {
    uni.navigateTo({ url })
}

async function getList(type = 1) {
    const res = await proxy.request('/blurb/get', { type }, {
        method: "GET"
    })
    console.log(res)
    fetchData.value = res.data.data
    console.log(fetchData.value)
}
onMounted(() => {
    getList()
})
</script>
<style lang="scss">
page {
    background-color: #F5F5F5;
}
</style>
<style lang="scss" scoped>
.u-page__tag-item {
		margin-right: 24rpx;
	}
.main-wrap {
    padding: 32rpx;
    &-info {
        width: 100%;
        padding: 32rpx;
        box-sizing: border-box;
        background-color: #FFFFFF;
        border-radius: 12rpx 12rpx 12rpx 12rpx;
    }
}

.fixed-action-wrap {
    position: fixed;
    left: 0;
    bottom: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 128rpx;
    padding: 32rpx;
    padding-bottom: env(safe-area-inset-bottom);
    box-sizing: border-box;

    &-button {
        display: flex;
        align-items: center;
        justify-content: center;
        width: calc(100% - 24px);
        height: 80rpx;
        background: #F2CB51;
        border-radius: 58rpx 58rpx 58rpx 58rpx;
    }
}
</style>